import React, {Component} from 'react';
import {connect} from 'react-redux'
import {actionCreators} from './store/index'
import {withRouter} from 'react-router-dom'
import {
    DetailWrapper,
    Header,
    Content,
}from './style'
class Detail extends Component {

    componentDidMount() {
        console.log(this.props.match.params.id)
        this.props.getDetail(this.props.match.params.id);
    }

    render() {
        const {title, content} = this.props;
        return (
            <DetailWrapper>
                <Header>{title}</Header>
                <Content dangerouslySetInnerHTML={{__html: content}}>
                    {/* <img src='https://img.tupianzj.com/uploads/allimg/202004/9999/93327628e9.jpg'/>
                    <p>思念一个人的滋味，就象是喝了一杯冰冷的水，然后一滴一滴凝成热泪。喜欢一个人倚窗听雨，看雨丝轻舞飞扬，听雨声滴答轻响，用双手盈握飘洒的冰凉，一丝淡淡的轻愁也会柔柔浮出，就这样陶醉于一种孤独的宁静中。</p>
                    <p>思念一个人的滋味，就象是喝了一杯冰冷的水，然后一滴一滴凝成热泪。喜欢一个人倚窗听雨，看雨丝轻舞飞扬，听雨声滴答轻响，用双手盈握飘洒的冰凉，一丝淡淡的轻愁也会柔柔浮出，就这样陶醉于一种孤独的宁静中。</p> */}
                    </Content>
            </DetailWrapper>
        )
    }
}

const mapStateToProps = (state) => ({
    title: state.get('detail').get('title'),
    content: state.get('detail').get('content'),
})
const mapDispatchToProps = (dispatch) => ({
    getDetail(id) {
        dispatch(actionCreators.getDetail(id));
    }
})
export default connect(mapStateToProps,mapDispatchToProps)(withRouter(Detail)) //withRouter异步组件;

